<template>
    <div>
        <el-row>
            <el-col :span="2"><el-button type="primary" plain @click="addRecord">添加</el-button></el-col>
            <el-col :span="2"><el-button type="primary" plain>返回</el-button></el-col>
        </el-row>
        <el-table :data="tableData" border style="width: 100%">
            <el-table-column prop="date" label="检测时间" width="180" align="center" class="el-icon-time">
            </el-table-column>
            <el-table-column prop="hresult" label="核酸结果" width="180" align="center"></el-table-column>
            <el-table-column prop="cresult" label="CT结果" width="180" align="center"></el-table-column>
            <el-table-column label="操作"  align="center">
                <el-button plain type="danger" size="mini" @click="open" >删除</el-button>
            </el-table-column>
        </el-table>
        <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage4"
              :page-sizes="[100, 200, 300, 400]"
              :page-size="100"
              layout="total, sizes, prev, pager, next, jumper"
              :total="400">
        </el-pagination>
    </div>
</template>
<script>
import request from '@/utils/request'

export default {
  data() {
    return {
      input: '',
      tableData: null,
      currentPage1: 5,
      currentPage2: 5,
      currentPage3: 5,
      currentPage4: 4
    }
  },
  created(){
      this.fetchData()
  },
  methods:{
      fetchData(){
          request({
              url: '../record_list.json',
              method: 'get'
          }).then(response => {
              this.tableData = response.data
          })
      },
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
      },
      showById(){
          this.$router.push("/patient/modify")
      },
      open() {
        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });          
        });
      }
  }
}
</script>